<template>
    <table border="1">
        <tr>
            <td>房型</td>
            <td>
                <select v-model="info.R_id">
                    <option :value="0">请选择</option>
                    <option v-for="i in xialainfo" :value="i.R_ID">{{ i.R_Name }}</option>
            </select>

            </td>
        </tr>
        <tr>
            <td>房号</td>
            <td>
                <select v-model="info.RN_id">
                    <option :value="0">请选择</option>
                    <option v-for="i in xialanumber" :value="i.RN_Id">{{ i.RN_Num }}</option>
            </select>

            </td>
        </tr>
      
    </table>
</template>
<script setup lang="ts">

import {onMounted,ref} from 'vue'
import { useRoute,useRouter } from 'vue-router';
import axios from 'axios'

import {useCounterStore} from '../../stores/counter.ts'

const userstore=useCounterStore();

const user=useRouter();

const names=ref("")




const use=useRoute();



const xialanumber=ref([{
    "RN_Id": 1,
    "RN_Num": "1002",
}])
const xialainfo=ref([{
    "R_ID": 1,
    "R_Name": "大床房",
}])
const info=ref({

  "RN_id": 0,
  "R_id": 0,
})
onMounted(()=>{
    xialanumbers()
    xialainfos()
    fantian()
})
const fantian=()=>{
    axios.get("https://localhost:7234/api/RoomInfoNumber/Getinfonumberbyid",{
        params:{
            id:use.params.id
        }
    })
    .then(res=>{
        info.value=res.data
    })
}






const xialanumbers=()=>{
    axios.get("https://localhost:7234/api/RoomInfoNumber/GetXiaLaNumber")
    .then(res=>{
        xialanumber.value=res.data
    })
}
const xialainfos=()=>{
    axios.get("https://localhost:7234/api/RoomNumber/GetXilaInfo")
    .then(res=>{
        xialainfo.value=res.data
    })
}


</script>

<style scoped>

</style>